<template>
	<div>
		<el-card class="!border-none p-4" shadow="never">
			<div class="topTitle font-bold main-color text-2xl mb-5">
				产品信息
			</div>
			<el-table class="mt-[20px]" size="large" :data="list"
				:header-cell-style="{'background':'#0054A6','color':'#fff','line-height':'52px','padding':'14px 0'}"
				:cell-style="{'color':'#0054A6','padding':'20px 0'}">
				<el-table-column label="总件数" prop="scene_name" align="center">
					<template #default="{ row }">
						<el-button type="primary" link>
							<span class="main-color">0133</span>
						</el-button>
					</template>
				</el-table-column>
				<el-table-column label="总毛重(kg)" prop="scene_name" align="center">
					<template #default="{ row }">
						<el-button type="primary" link>
							<span class="main-color">2412800</span>
						</el-button>
					</template>
				</el-table-column>
				<el-table-column label="总体积(CBM)" prop="2342" align="center" />
				<el-table-column label="总托数" prop="scene_name" align="center">
					<template #default="{ row }">
						<span class="main-color">200</span>
					</template>
				</el-table-column>
			</el-table>
		</el-card>
		<el-card class="!border-none p-4 mt-[20px]" shadow="never">
			<div class="topTitle font-bold main-color text-2xl mb-5">
				报价
			</div>
			<div class="main-color mt-[30px]">
				<el-row >
					<el-col :span="6">
						<div class="flex-col">
							<span class="mb-[10px]">业务编码</span>
							<el-input disabled v-model="value" placeholder="请输入"></el-input>
						</div>
					</el-col>
					<el-col :span="6">
						<div class="flex-col ml-[30px]">
							<span class="mb-[10px]">截单日期</span>
							<el-input disabled v-model="value" placeholder="请输入"></el-input>
						</div>
					</el-col>
					<el-col :span="6">
						<div class="flex-col ml-[30px]">
							<span class="mb-[10px]">业务员</span>
							<el-input disabled v-model="value" placeholder="请输入"></el-input>
						</div>
					</el-col>
					<el-col :span="6">
						<div class="flex-col ml-[30px]">
							<span class="mb-[10px]">目的港</span>
							<el-input disabled v-model="value" placeholder="请输入"></el-input>
						</div>
					</el-col>
					<el-col :span="6">
						<div class="flex-col mt-[30px]">
							<span class="mb-[10px]">接单号</span>
							<el-input disabled v-model="value" placeholder="请输入"></el-input>
						</div>
					</el-col>
					<el-col :span="6">
						<div class="flex-col mt-[30px] ml-[30px]">
							<span class="mb-[10px]">件毛体</span>
							<el-input  placeholder="请输入"></el-input>
						</div>
					</el-col>
					<el-col :span="6">
						<div class="flex-col mt-[30px] ml-[30px]">
							<span class="mb-[10px]">预计重量</span>
							<el-input disabled v-model="value" placeholder="请输入"></el-input>
						</div>
					</el-col>
					<el-col :span="6">
						<div class="flex-col mt-[30px] ml-[30px]">
							<span class="mb-[10px]">预计方数</span>
							<el-input disabled v-model="value" placeholder="请输入"></el-input>
						</div>
					</el-col>
					<el-col :span="6">
						<div class="flex-col mt-[30px]">
							<span class="mb-[10px]">实际进仓重量</span>
							<el-input  placeholder="请输入"></el-input>
						</div>
					</el-col>
					<el-col :span="6">
						<div class="flex-col mt-[30px] ml-[30px]">
							<span class="mb-[10px]">实际进仓方数</span>
							<el-input  placeholder="请输入"></el-input>
						</div>
					</el-col>
					<el-col :span="6">
						<div class="flex-col mt-[30px] ml-[30px]">
							<span class="mb-[10px]">单价(USD/吨)</span>
							<el-input  placeholder="请输入"></el-input>
						</div>
					</el-col>
					<el-col :span="6">
						<div class="flex-col mt-[30px] ml-[30px]">
							<span class="mb-[10px]">进仓费(RMB)</span>
							<el-input  placeholder="请输入"></el-input>
						</div>
					</el-col>
					<el-col :span="6">
						<div class="flex-col mt-[30px]">
							<span class="mb-[10px]">USD</span>
							<el-input  placeholder="请输入"></el-input>
						</div>
					</el-col>
					<el-col :span="6">
						<div class="flex-col mt-[30px] ml-[30px]">
							<span class="mb-[10px]">RMB</span>
							<el-input  placeholder="请输入"></el-input>
						</div>
					</el-col>
					<el-col :span="6">
						<div class="flex-col mt-[30px] ml-[30px]">
							<span class="mb-[10px]">备注</span>
							<el-input  placeholder="请输入"></el-input>
						</div>
					</el-col>
				</el-row>
			</div>
		</el-card>
		<el-row class="mt-[30px]">
			<el-button class="main-color1 w-[100px] h-[36px]">
				<router-link :to="{
						path: getRoutePath('dealOrder.dealOrder/index')
				    }">
					<span>取消</span>
				</router-link>
			</el-button>
			<el-button class="w-[100px] bg-[#0054A6] h-[36px]" type="primary">保存</el-button>
		</el-row>
	</div>
</template>

<script lang="ts" setup>
	import { getRoutePath } from '@/router'
	const list = ref<Array<any>>([
		{}
	])
	const value = ref('123432152')
</script>


<style scoped>
	.flex-col{
		display: flex;
		flex-direction: column;
	}
</style>